<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

    <head>

        <title>Titan Shift Manager - Home</title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

        <!-- Sam Skin CSS for TabView -->
        <link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.8.2r1/build/tabview/assets/skins/sam/tabview.css" />

        <!-- JavaScript Dependencies for Tabview: -->
        <script type="text/javascript" src="http://yui.yahooapis.com/2.8.2r1/build/yahoo-dom-event/yahoo-dom-event.js"></script>
        <script type="text/javascript" src="http://yui.yahooapis.com/2.8.2r1/build/element/element-min.js"></script>

        <!-- Source file for TabView -->
        <script type="text/javascript" src="http://yui.yahooapis.com/2.8.2r1/build/tabview/tabview-min.js"></script>

	<link rel="stylesheet" type="text/css" href="styles/base.css" />

    </head>

    <body class="yui-skin-sam">

        <div id="container">

            <div id="logo"></div>
            <div id="loginoptions">
                <a href="account.html">ACCOUNT</a>&nbsp;|&nbsp;<a href="index.html">LOGOUT</a>
            </div>

            <div id="mainpanel">

                <!-- Tab Selectors -->
                <div id="content-explorer">
                    <ul class="yui-nav">
                        <li class="selected"><a href="#tab1"><em>My Inbox</em></a></li>
                        <li><a href="#tab2"><em>My Availability</em></a></li>
                        <li><a href="#tab3"><em>My Schedule</em></a></li>
                    </ul>
                    <div class="yui-content">

                        <div>

                            <div id="personalinfo">

                                <div id="photo">
                                    <img src="images/profile_missing.png" alt="Missing Proile" />
                                </div>
                                <div id="name">
                                    John Doe
                                </div>

                                <div id="quote">
                                    It's going to be a fun week.... I promise c ya soon guyz !!!
                                </div>

                                <div style="border-top: 1px solid lightgray; float: left; height: 100px; margin-top: 10px; width: 520px;">
                                        <div id=""inbox">my inbox</div>
                                        <div style="color: gray; float: left; font: normal 12px Tahoma; line-height: 1.6em;">
                                            View posts and important news flashes going on at your job<br/>
                                            Stay updated 4/7<br/>
                                            View Co workers status.
                                        </div>
                                </div>

                            </div>

                            <div style="border: 1px solid lightgray; color: gray; float: left; font: normal 12px Tahoma; height: 200px; padding: 20px; width: 248px; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; line-height: 1.6em;">
                                SITE NAME<br/>
                                IMPORTANT NEWS FLASH
                            </div>

                            <div style="background: url('images/gradient.png') repeat-x; border: 1px solid lightgray; color: gray; float: left; font: normal 12px Tahoma; height: 36px; margin-top: 10px; width: 100%;">

                            </div>
                            <div style="background: #9ca9b2; border: 1px solid #666; float: left; height: 12px; width: 100%;">

                            </div>

                            <div id="messagelist">

                                <div id="message1" class="messagedetail">

                                    <div class="messagephoto">
                                        <img src="images/profile_missing.png" alt="Missing Proile" />
                                    </div>
                                    <div class="messagesender">
                                        Jeremy Harison
                                    </div>
                                    <div class="messagedate">
                                        03/31/2011 17:15
                                    </div>
                                    <div class="messagetext">
                                        Hi to all my co-workers. This week we will be having a tournament in the lounge. Don't forget to print your pajamas....
                                    </div>

                                </div>

                                <div id="message2" class="messagedetail">

                                    <div class="messagephoto">
                                        <img src="images/profile_missing.png" alt="Missing Proile" />
                                    </div>
                                    <div class="messagesender">
                                        Jeremy Harison
                                    </div>
                                    <div class="messagedate">
                                        03/31/2011 17:15
                                    </div>
                                    <div class="messagetext">
                                        Hi to all my co-workers. This week we will be having a tournament in the lounge. Don't forget to print your pajamas....
                                    </div>

                                </div>

                                <div id="message3" class="messagedetail">

                                    <div class="messagephoto">
                                        <img src="images/profile_missing.png" alt="Missing Proile" />
                                    </div>
                                    <div class="messagesender">
                                        Jeremy Harison
                                    </div>
                                    <div class="messagedate">
                                        03/31/2011 17:15
                                    </div>
                                    <div class="messagetext">
                                        Hi to all my co-workers. This week we will be having a tournament in the lounge. Don't forget to print your pajamas....
                                    </div>

                                </div>
                                
                            </div>

                        </div>

                        <div><p>Tab Two Content</p></div>
                        <div><p>Tab Three Content</p></div>

                    </div>

                </div>

                <a href="javascript:location.reload(true)">Refresh this page</a>

            </div>

            <div class="clear"></div>

        </div>

    </body>

    <script type="text/javascript">
    //<![CDATA[
    // Generate a set of tabs to use
    var myTabs = new YAHOO.widget.TabView("content-explorer");
    //]]>
    </script>

</html>
